<template>
    <div>
        <h1>{{$store.getters.type}}{{$store.state.count}}</h1>
        <button @click='add'>增加数字</button>
        <button @click='changeCount(10)'>增加数字2</button>
        <button @click='color'>换颜色</button>
        <button @click='changeColorAsync'>换颜色2</button>
    </div>
</template>
<script>
// @ is an alias to /src
import {mapMutations,mapActions} from 'vuex'
export default {
    name: 'XXX',
    data() {
        return {
        
        }
    },
    methods: {
      ...mapMutations(['changeCount']),
      ...mapActions(['changeColorAsync']),
        add(){
          // mutations中的函数
          this.$store.commit('changeCount',10)
        },
        color(){
          // this.$store.commit({
          //   type:'changeColor',
          //   col:'blue'
          // })
          this.$store.dispatch('changeColorAsync',1,2,3)
        }
    }
}
</script>
<style lang="less">

</style>